<!DOCTYPE html>
<html>
<head>
	<title>float方式实现三列布局</title>
	<style>
		.left{
			float: left;
			width: 200px;
			height: 400px;
			background-color: yellow;
			margin-left: -100%;
		}
		.right{
			float: right;
			width: 200px;
			height: 400px;
			background-color: yellow;
			margin-left: -200px;
		}
		.middle{
			float: left;
			padding: 0 200px;
		}
	</style>
</head>
<body>
	<div>
		<div class="middle">基本上最常见的答案是这三种布局方式，但是很多人都只说一个 flex，其他两种布局方式稍微考虑下就可以想到（o´ﾟ□ﾟ`o），该问题不是想让面试者回答出什么奇淫技巧，只是对 CSS 基础知识的一个考察。基本上最常见的答案是这三种布局方式，但是很多人都只说一个 flex，其他两种布局方式稍微考虑下就可以想到（o´ﾟ□ﾟ`o），该问题不是想让面试者回答出什么奇淫技巧，只是对 CSS 基础知识的一个考察。基本上最常见的答案是这三种布局方式，但是很多人都只说一个 flex，其他两种布局方式稍微考虑下就可以想到（o´ﾟ□ﾟ`o），该问题不是想让面试者回答出什么奇淫技巧，只是对 CSS 基础知识的一个考察。基本上最常见的答案是这三种布局方式，但是很多人都只说一个 flex，其他两种布局方式稍微考虑下就可以想到（o´ﾟ□ﾟ`o），该问题不是想让面试者回答出什么奇淫技巧，只是对 CSS 基础知识的一个考察。</div>
		<div class="left"></div>
		<div class="right"></div>
	</div>
</body>
</html>